<template>
	<a-modal :title="title" :width="800" :ok=false :visible="visible" :confirmLoading="confirmLoading" :okButtonProps="{ props: {disabled: disableSubmit} }"
	@ok="handleOk" @cancel="handleCancel" cancelText="关闭">

		<a-spin :spinning="confirmLoading">
			<a-form :form="form">
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="机构名称" :hidden="false" hasFeedback>
					<a-input id="departName" placeholder="请输入机构/部门名称" v-decorator="['deptName', validatorRules.departName ]" />
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" :hidden="seen" label="上级部门" hasFeedback>
					<a-input id="departName" placeholder="请输入上级部门" v-model="parentName" disabled/>
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="电话">
					<a-input placeholder="请输入电话" v-decorator="['phone',validatorRules.mobile]" />
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="传真">
					<a-input placeholder="请输入传真" v-decorator="['fax', {}]" />
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="地址">
					<a-input placeholder="请输入地址" v-decorator="['address', {}]" />
				</a-form-item>
				<a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="备注">
					<a-textarea placeholder="请输入备注" v-decorator="['remark', {}]" />
				</a-form-item>

			</a-form>
		</a-spin>
	</a-modal>
</template>

<script>
	import {
		postAction,
		getAction
	} from '@/api/manage'
	// import { queryIdTree } from '@/api/api'
	import pick from 'lodash.pick'
	import ATextarea from 'ant-design-vue/es/input/TextArea'
	export default {
		name: "SysDepartModal",
		components: {
			ATextarea
		},
		data() {
			return {
				departTree: [],
				orgTypeData: [],
				phoneWarning: '',
				departName: "",
				title: "操作",
				seen: false,
				visible: false,
				condition: true,
				disableSubmit: false,
				model: {},
				menuhidden: false,
				menuusing: true,
				parentName: "",
				labelCol: {
					xs: {
						span: 24
					},
					sm: {
						span: 5
					},
				},
				wrapperCol: {
					xs: {
						span: 24
					},
					sm: {
						span: 16
					},
				},

				confirmLoading: false,
				form: this.$form.createForm(this),
				validatorRules: {
					departName: {
						rules: [{
							required: true,
							message: '请输入机构/部门名称!'
						}]
					},
					deptCode: {
						rules: [{
							required: true,
							message: '请输入机构编码!'
						}]
					},
					mobile: {
						rules: [{
							validator: this.validateMobile
						}]
					}
				},
				url: {
					add: "/sys/dept/add",
				},
				dictDisabled: true,
			}
		},
		created() {},
		methods: {
			loadTreeData() {
				// var that = this;
				// queryIdTree().then((res)=>{
				//   if(res.success){
				//     that.departTree = [];
				//     for (let i = 0; i < res.result.length; i++) {
				//       let temp = res.result[i];
				//       that.departTree.push(temp);
				//     }
				//   }

				// })
			},
			add(depart) {
				console.log(depart)
				if (depart) {
					this.seen = false;
					this.dictDisabled = false;
				} else {
					this.seen = true;
					this.dictDisabled = true;
				}
				this.edit(depart);
			},
			edit(depart) {
				this.form.resetFields();
				this.model = Object.assign({}, {});
				this.visible = true;
				this.loadTreeData();
				if(depart) {
					const that = this
					let departNew = ""
					if (depart instanceof Array) {
						departNew = depart[0]
					} else {
						departNew = depart
					}
					getAction("/sys/dept/info/" + departNew).then((res) => {
						if (res.code == "00000") {
							that.parentName = res.data.deptName
							that.model.parentId = departNew
						}
					})
				}
				this.$nextTick(() => {
					this.form.setFieldsValue(pick(this.model, 'departName', 'departNameEn', 'departNameAbbr',
						'departOrder', 'description', 'orgCode', 'mobile', 'fax', 'address', 'memo', 'status', 'delFlag'))
				});
			},
			close() {
				this.$emit('close');
				this.disableSubmit = false;
				this.visible = false;
			},
			handleOk() {
				const that = this;
				// 触发表单验证
				this.form.validateFields((err, values) => {
					if (!err) {
						that.confirmLoading = true;
						let formData = Object.assign(this.model, values);
						//时间格式化
						console.log(formData)
						postAction(this.url.add, formData, "post").then((res) => {
							if (res.code == "00000") {
								that.$message.success("添加成功");
								that.loadTreeData();
								that.$emit('ok');
							} else {
								that.$message.warning("添加失败");
							}
						}).finally(() => {
							that.confirmLoading = false;
							that.close();
						})

					}
				})
			},
			handleCancel() {
				this.close()
			},
			validateMobile(rule, value, callback) {
				if (!value || new RegExp(/^1([38][0-9]|4[579]|5[0-3,5-9]|6[6]|7[0135678]|9[89])\d{8}$/).test(value)) {
					callback();
				} else {
					callback("您的手机号码格式不正确!");
				}

			}
		}
	}
</script>

<style scoped>

</style>
